<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<th:block th:include="include :: header('登录')"/>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="../static/ocean/css/ry-ui.css" th:href="@{/ocean/css/ry-ui.css?v=4.7.5}" rel="stylesheet"/>
    <link href="../static/ocean/css/bice.css" th:href="@{/ocean/css/bice.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/prt.css" th:href="@{/ocean/css/prt.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/common.css" th:href="@{/ocean/css/common.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/datepicker3.css" th:href="@{/ocean/css/datepicker3.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/pagination.css" th:href="@{/ocean/css/pagination.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/style.css" th:href="@{/ocean/css/style.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/head.css" th:href="@{/ocean/css/head.css}" rel="stylesheet"/>
    <link href="../static/ocean/css/index.css" th:href="@{/ocean/css/index.css}" rel="stylesheet"/>
</head>
<style type="text/css">
    pre{
        white-space:pre-wrap;
        white-space:-moz-pre-wrap;
        white-space:-pre-wrap;
        white-space:-o-pre-wrap;
        word-wrap:break-word;
        color: ;
    }
</style>
<body>
<div class="prt_cont1_box">
    <div class="prt_cont">
        <div style="display: flex;justify-content: center;width: 100%;margin-top: 40px">
            <div style="margin-top: 10px;margin-right: 100px;"><img src="./img/z.png"></div>
            <div style="font-size: 27px;">产品介绍</div>
            <div style="margin-top: 10px;margin-left: 100px;"><img src="./img/y.png"></div>
        </div>
        <div class="clearfix" style="margin-top: 40px"></div>
        <div class="prt_xq">
            <input type="hidden" id="productId" th:value="${product.id}"/>
            <div id="namep" style="font-size:16px;">[[${product.productName}]]</div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">要素：</span>
                <span class="prt_xq_cot">[[${product.elementName}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">覆盖海区：</span>
                <span class="prt_xq_cot">[[${product.oceanName}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">模式：</span>
                <span class="prt_xq_cot">[[${product.modeName}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">分辨率   ：</span>
                <span class="prt_xq_cot">[[${product.resolution}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">预报时效：</span>
                <span class="prt_xq_cot">[[${product.forecastAging}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">文件格式：</span>
                <span class="prt_xq_cot">[[${product.fileType}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">起报时间：</span>
                <span id="qbsj" class="prt_xq_cot">[[${product.frequency}]]</span>
                <span id="cpsjlx" style="display: none" class="prt_xq_cot">[[${product.pnametype}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">预报时间间隔：</span>
                <span id="sjjg" class="prt_xq_cot">[[${product.forecastInterval}]]</span>
            </div>
           <div class="prt_xq_box left" style="display: none">
                <span class="prt_xq_tit">去除数值：</span>
                <span id="isjc" class="prt_xq_cot">[[${product.isjc}]]</span>
            </div>
            <div class="prt_xq_box left">
                <span class="prt_xq_tit">生产部门：</span>
                <span class="prt_xq_cot">[[${product.productDeptName}]]</span>
            </div>
            <div class="prt_xq_box left">
                <div class="prt_xq_bt left"><a th:onclick="subscription([[${product.id}]])" >订阅</a></div>
            </div>
            <div class="clearfix"></div>
        </div>
        <div class="prt_xq1"><pre style="border: 0;background-color: #fafafa">[[${product.productDrief}]]</pre>
        </div>
        <div class="prt_xq2">
            <span th:each="list:${attachments}" >
                <div class="prt_xq_box1 left">
                    <span class="prt_xq_tit left">文件名称：</span>
                    <span class="prt_xq_cot left">[[${list.document.documenttitle}]]</span>
                    <input type="hidden" id="fileId" th:value="${list.ID}"/>
                    <input type="hidden" id="subClassName" th:value="${list.subclassname}"/>
                    <div class="prt_xq_bt left"><a onclick="fujianDowload()" >下载</a></div>
                    <div class="clearfix"></div>
                </div>
            </span>

            <div class="clearfix"></div>
        </div>
        <div>
            <table class="prt_tab" border="0" cellspacing="0" cellpadding="0">
                <thead style="background-color:#efeff0; ">
                <td class="prt_tab_3" style="width:551px;color:#333;">文件名</td>
                <td class="prt_tab_3" style="width:300px;color:#333;">文件大小</td>
                <td class="prt_tab_3" style="width:269px;color:#333;">发布时间</td>
                <td class="prt_tab_3" style="width:132px;color:#333;">操作</td>
                </thead>
                <tbody id="tbody" style="border-bottom:solid 1px #d2d2d2">
                </tbody>
            </table>
            <div class="clearfix">
                <ul style="float:right" id="example"></ul>
            </div>
        </div>
    </div>
    <br/><br/>
    <center>
        <div class="dingyue_3" onclick="returnback()">返回</div>
    </center>
</div>
<div class="prt_cont2_box"></div>

</body>
<!--<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/js-base64@3.6.0/base64.min.js"></script>-->
<script th:src="@{/ocean/js/base64.js}"></script>
<script th:src="@{/ocean/js/detail.js}"></script>
<script th:src="@{/ocean/js/bootstrap-paginator.js}"></script>
<script>
function subscription(productId) {
    $("#test").load("/home/productBrowsing/subscription/"+productId);
}
function returnback() {
    $("#test").load("/home/productBrowsing/browseHP")
}

</script>
</html>
